.header-main {
  width           : 100%;
  height          : 50px;
  background-color: #282b33;
  display         : flex;
  justify-content : space-between;
  position        : fixed;

  .modelArts-header-container {
    display        : flex;
    align-items    : center;
    z-index        : 9999;
    background     : none;
    user-select    : none;
    margin         : 8px 0 8px 24px;
    justify-content: space-evenly;
    cursor         : pointer;

    .logo-text {
      display    : inline-block;
      font-size  : 14px;
      color      : #fff;
      line-height: 24px;
      margin-left: 8px;
    }

    .logo {
      height          : 28px;
      width           : 28px;
      background-size : cover;
      display         : inline-block;
      background-image: url("../../../assets/model-arts-logo.svg");
    }
  }

  a {
    line-height    : 40px;
    color          : #ADB0B8;
    text-decoration: none;
    padding        : 10px 10px;
  }

  .icon {
    margin: 5px;
  }

  .tabs {
    font-size: 18px;

    &::before {
      display: table;
      content: " ";
    }

    &::after {
      display: table;
      content: " ";
      clear  : both;
    }

    ul {
      list-style : none;
      margin-left: 50px;
    }

    li {
      display     : inline;
      margin-left : 20px;
      margin-right: 20px;
    }

    .tab-active {
      color        : #fff;
      border-bottom: 2px solid#96ADFA;
      font-weight  : 500;
      cursor       : pointer;
    }

    a:hover {
      text-shadow: 0 0 1px #fff;
      color      : #ADB0B8;
      font-weight: 500;
    }
  }

  .container-pos {
    position: fixed;
    top     : 8px;
  }
}